<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  
</body>
</html>
<script>
// JS在ES6之前，有两种作用域：`全局作用域` 、 `函数作用域`。

// `作用域` 的 作用：
  // 即确定 变量的值。

/* 全局作用域：

  // 全局作用域：即`.html`文件下 script 标签中的范围，都叫 全局作用域。
    
  var num = 123; // 即表示 num 在 全局作用域中，被声明了。

  // 若 num 没被 var 声明，会报 `num is not defined` 的报错；
    // 即 num 未在 `作用域` 中找到。
  console.log(num);

*/



/* 函数作用域：
  函数作用域，可被`包含/嵌套`，即函数作用域 从属于 其他作用域(全局作用域)；


  函数作用域总结：
    1. 若函数体内，使用某个变量，会先在函数体内(即本函数作用域内)，
      就近(向上) 就近，确定 变量的值。
    2. 若本函数作用域内，无该变量；再向上层作用域寻找其是否有该变量的声明。
    3. 若一直找到 全局作用域，都没有该变量的声明，即报 not defined 的报错。

*/


// 全局作用域
/* 一层函数 与 全局作用域的关系
  var x = 99, y = 33;

  function add() {
    // var x = 13, y = 1; // 是在 函数作用域中声明的 x 和 y
    // 函数代码块中，即为 函数作用域
    return x + y;
  }

  add(1, 3);

*/


/* 嵌套函数间，作用域的关系：
  // 注：下面为 函数 嵌套 函数， 
    // 即形成了三层作用域： 第一层：add的作用域，第二次：f的作用域，第三层：全局作用域。
  function f() {
    var x = 12, y = 33;
    function add() {
      // var x = 13, y = 1; // 是在 函数作用域中声明的 x 和 y
      // 函数代码块中，即为 函数作用域
      return x + y;
    }

    add(1, 3);
  }


  console.log(add(1, 3));
*/



// 最后，作用域间，变量值的确定，只能由 子级作用域，往上层作用域 去确定变量的值；
  // 反之不行。


function f() {
  var x = 123;
}
f();

console.log(x); // 全局作用域，获取不到 函数作用域的 变量 - x = 123;。

</script>